<!DOCTYPE html>
<html>
<head>
	<title>没想到你是这样的宝宝</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
	<meta content="yes" name="apple-mobile-web-app-capable" />
	<meta content="black" name="apple-mobile-web-app-status-bar-style">
	<meta content="telephone=no" name="format-detection" />
	<meta content="emai=no" name="format-detection" />
	<link href="/assets/css/common.css" rel="stylesheet" />
	<script src="/assets/zepto-1.1.6.js"></script>
	<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
	<style>
		html, body {
			background-color: #000308;
		}

		.hide {
			display: none;
		}

		.wrapper {
			width: 100%;
			max-width: 750px;
			max-height: 100vh;
			margin: 0 auto;
			text-align: center;
			position: relative;
		}

			.wrapper > p {
				background-color: #000;
				bottom: 0;
				position: absolute;
				height: 17.63vh;
				pointer-events: none;
				text-align: center;
				width: 100%;
			}

				.wrapper > p > img {
					max-width: 100%;
					max-height: 17.63vh;
				}

		#resultImg {
			max-width: 100%;
			max-height: 100vh;
		}
	</style>
	<script>
	var _hmt = _hmt || [];
	(function() {
	  var hm = document.createElement("script");
	  hm.src = "//hm.baidu.com/hm.js?19f39b206aedf768b42fbc69e4e4f721";
	  var s = document.getElementsByTagName("script")[0]; 
	  s.parentNode.insertBefore(hm, s);
	})();
	</script>
</head>
<body style="margin:0">
	<input type="hidden" name="username" value="<?php echo $row['nickname']?>" />
	<img class="hide" id="bgImg" src="/assets/images/bg.jpg" />
	<img class="hide" id="tagsImg" src="<?php echo $row['tag_image']?>" />
	<?php if($device == 'wechat'):?>
	<img class="hide" id="codeImg" src="/assets/images/qrcode.png" />
	<?php else:?>
	<img class="hide" id="codeImg" src="/assets/images/qrcode_1.png" />
	<?php endif;?>
	<canvas class="hide" id="result" width="750" height="1350">
		Your browser does not support the canvas element.
	</canvas>
	<div class="wrapper">
		<img id="resultImg" src="" />
		<p class="vertical">
			<img src="/assets/images/footer.png" />
		</p>
	</div>
	<script type="text/javascript">
		var canvas = document.getElementById("result");
		var context = canvas.getContext("2d");
		context.font = "bold 70px 'Microsoft YaHei'";
		context.textAlign = "center";
		context.fillStyle = "#ffffff";
		function drawImg(imgId, x, y, w, h) {
			var image = new Image();
			image.src = $("#" + imgId).attr("src");
			context.drawImage(image, x, y, w, h);
		}
		window.onload = function () {
			drawImg("bgImg", 0, 0, 750, 1350);
			drawImg("tagsImg", 0, 200, 750, 900);
			drawImg("codeImg", 0, 1120, 750, 238);
			context.fillText($("input[name='username']").val() + " 宝宝", 375, 145);
			$.ajax({
				url: "/plato/image",
				data: {id: <?php echo $row['id']?>, image_code: canvas.toDataURL("image/jpeg")},
				dataType: "json",
				type: "post",
				success: function(res){
					if(res.code > 0)
					{
						$("#resultImg").attr("src", res.image_path);
					}
					
				}
			});
			
		};
	</script>
	<?php if($device == 'wechat'):?>
	<script type="text/javascript">
    Zepto(function ($) {
        wx.config({
            debug: false,
            appId: '<?php echo $js_config['appId']?>',
            timestamp: <?php echo $js_config['timestamp']?>,
            nonceStr: '<?php echo $js_config['noncestr']?>',
            signature: '<?php echo $js_config['signature']?>',
            jsApiList: [
            	'onMenuShareTimeline',
            	'onMenuShareAppMessage'
            ]
        });
        wx.ready(function () {
        	wx.onMenuShareTimeline({
            	title: '<?php echo $share_content;?>',
        	    link: '<?php echo $share_url?>', // 分享链接
        	    imgUrl: 'http://wx.zhishimama.com/assets/images/share.jpg', // 分享图标
        	    success: function () {
        	        // 用户确认分享后执行的回调函数
        	        $.ajax({
        				url: "/mosquito/share",
        				data: {id: <?php echo $row['id']?>},
        				type: "post",
        				success: function(res){
        				}
        		    });
        	    },
        	    cancel: function () {
        	        // 用户取消分享后执行的回调函数
        	    }
        	});

        	wx.onMenuShareAppMessage({
            	title: '<?php echo $share_desc?>',
        	    desc: '<?php echo $share_content;?>', // 分享描述
        	    link: '<?php echo $share_url?>', // 分享链接
        	    imgUrl: 'http://wx.zhishimama.com/assets/images/share.jpg', // 分享图标
        	    type: 'link', // 分享类型,music、video或link，不填默认为link
        	    dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
        	    success: function () {
        	        // 用户确认分享后执行的回调函数
        	    	$.ajax({
        				url: "/plato/share",
        				data: {id: <?php echo $row['id']?>},
        				type: "post",
        				success: function(res){
        				}
        		    });
        	    },
        	    cancel: function () {
        	        // 用户取消分享后执行的回调函数
        	    }
        	});
        });
    })
	</script>
	<?php endif;?>
</body>
</html>